<template>
    <div>
        <p style="margin: 0">
            {{ index + 1 }}、{{ item.questionName }}({{ item.questionScore }})
        </p>
        <el-radio-group v-model="radioItem[index]" :change="handleChange()">
            <div v-if="type === 'singal'">
                <div class="single">
                    <el-radio label="A">{{ item.questionOptionIds[0] }}</el-radio>
                </div>
                <div class="single">
                    <el-radio label="B">{{ item.questionOptionIds[1] }}</el-radio>
                </div>
                <div class="single">
                    <el-radio label="C">{{ item.questionOptionIds[2] }}</el-radio>
                </div>
                <div class="single">
                    <el-radio label="D">{{ item.questionOptionIds[3] }}</el-radio>
                </div>
            </div>
            <div v-else-if="type === 'judge'">
                <div class="judge">
                    <el-radio label="对">{{ item.questionOptionIds[0] }}</el-radio>
                </div>
                <div class="judge">
                    <el-radio label="错">{{ item.questionOptionIds[1] }}</el-radio>
                </div>
            </div>
        </el-radio-group>
    </div>
</template>

<script>
export default {
    props: ['index', 'item', 'type'],
    data() {
        return {
            radioItem: []
        }
    },
    methods: {
        handleChange() {
            let tempArr = []
            tempArr.push(this.radioItem)
            const child = {
                no: this.$props.index + 1,
                questionId: this.$props.item?.questionId,
                answer: tempArr
            }
            this.$emit('radioChildEvent', child)
        }
    }
}
</script>